 var jcrop_api;
function initCrop(){
   // Create variables (in this scope) to hold the API and image size
      var  boundx, boundy;
      var OriginImage=new Image();
       OriginImage.src=$('#target').attr("src");
      $('#target').Jcrop({
        onChange: updatePreview,
        onSelect: updatePreview,
        onRelease: releaseCheck,
        minSize:  [$('#hideDivForPre').width(),$('#hideDivForPre').height()],
        aspectRatio: 1
      },function(){
     
        // Use the API to get the real image size
        var bounds = this.getBounds();
        boundx = bounds[0];
        boundy = bounds[1];
        // Store the API in the jcrop_api variable
        
        jcrop_api = this;
        jcrop_api.animateTo([ 0, 0, $('#hideDivForPre').width(), $('#hideDivForPre').height()]);
      });

      function updatePreview(c)
      {
        if (parseInt(c.w) > 0)
        {
          var rx = $('#hideDivForPre').width() / c.w;
          var ry = $('#hideDivForPre').height() / c.h;
          $('#preview').css({
            width: Math.round(rx * boundx) + 'px',
            height: Math.round(ry * boundy) + 'px',
            marginLeft: '-' + Math.round(rx * c.x) + 'px',
            marginTop: '-' + Math.round(ry * c.y) + 'px'
          });
        }
          $('#x1').val(Math.round(c.x*OriginImage.width/boundx));
	      $('#y1').val(Math.round(c.y*OriginImage.height/boundy));
	      $('#x2').val(Math.round(c.x2*OriginImage.width/boundx));
	      $('#y2').val(Math.round(c.y2*OriginImage.height/boundy));
      };
     function releaseCheck()
        {
					jcrop_api.animateTo([ 0, 0, $('#hideDivForPre').width(), $('#hideDivForPre').height()]);
				
        };
}

function initCropActive(ratio){
   // Create variables (in this scope) to hold the API and image size
      var  boundx, boundy;
      var OriginImage=new Image();
       OriginImage.src=$('#targetActive').attr("src");
      $('#targetActive').Jcrop({
        onChange: updatePreview,
        onSelect: updatePreview,
        onRelease: releaseCheck,
        minSize:  [511*ratio,262*ratio],
        aspectRatio: 511/262
      },function(){
     
        // Use the API to get the real image size
        var bounds = this.getBounds();
        boundx = bounds[0];
        boundy = bounds[1];
        // Store the API in the jcrop_api variable
        
        jcrop_api = this;
        jcrop_api.animateTo([ 0, 0,511*ratio, 262*ratio]);
      });

      function updatePreview(c)
      {
       if (parseInt(c.w) > 0)
        {
          var rx = $('#hideDivForPre').width() / c.w;
          var ry = $('#hideDivForPre').height() / c.h;
          $('#preview').css({
            width: Math.round(rx * boundx) + 'px',
            height: Math.round(ry * boundy) + 'px',
            marginLeft: '-' + Math.round(rx * c.x) + 'px',
            marginTop: '-' + Math.round(ry * c.y) + 'px'
          });
        }
          $('#x1').val(Math.round(c.x*OriginImage.width/boundx));
	      $('#y1').val(Math.round(c.y*OriginImage.height/boundy));
	      $('#x2').val(Math.round(c.x2*OriginImage.width/boundx));
	      $('#y2').val(Math.round(c.y2*OriginImage.height/boundy));
      };
       function releaseCheck()
        {
					jcrop_api.animateTo([ 0, 0,511*ratio, 262*ratio]);
				
        };
     
}